<!-- 关于我们 -->
<template>
  <div>
      <!-- 标题 -->
      <div class="AboutUsTitle">{{datas.title}}</div>
      <!-- 内容 -->
      <div class="aboutCompany">
          <!-- 图片 -->
          <div class="companyImg">
              <img :src="datas.img" alt="">
          </div>
          <!-- 简介 -->
          <div class="companyInfo">
              <!-- 公司名称 -->
              <div class="companyName">{{datas.name}}</div>
              <!-- 公司简介 -->
              <div class="companyIntro">{{datas.intro}}</div>
          </div>
      </div>
      <slot></slot>
  </div>
</template>

<script>
export default {
  data () {
    return {
    };
  },
  props:{
      datas:Object
  },

  components: {},

  computed: {},

  methods: {}
}

</script>
<style scoped>
.AboutUsTitle{
    padding: 10px 10px;
    box-sizing: border-box;
    border: 1px solid #eee;
    border-left: 5px solid red;
}
.aboutCompany{
    display: flex;
    flex-direction: row;
}
.companyImg{
    width: 300px;
    height: 200px;
}
.companyImg img{
    width: 100%;
    height: 100%;
}
.aboutCompany{
    margin-top: 10px;
    border: 1px solid #eee;
    padding: 20px;
}
.companyInfo{
    margin-left: 30px;
    width: 300px;
}
.companyName{
    font-weight: bold;
    color: #3344ee;
}
.companyIntro{
    font-size: 13px;
}
</style>